import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';
import 'widget/config_result_widget.dart';

import '../../../app_files.dart';
import 'action.dart';
import 'state.dart';
const double kOrderImageWidth = 90;

Widget buildView(
    SafeOrderViewState state, Dispatch dispatch, ViewService viewService) {
  Widget _emptyWidget() => Container(
        margin: EdgeInsets.only(top: 108),
        child: Center(
          child: Column(
            children: [
              Image.asset('images/no_order.png'),
              Padding(padding: EdgeInsets.only(top: 30)),
              Text(
                '您的安检记录还未生成...',
                style: TextThemeConfig.Font12WithColor99,
              ),
            ],
          ),
        ),
      );

  Widget _orderStatusWidget() {
    List<String> titles = ['正常', '自修', '隐患', '维修'];

    return Container(
      padding: EdgeInsets.only(left: 15, right: 15),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                '安检结果',
                style: TextThemeConfig.Font16BoldWithColor22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
          ),
          Container(
            child: Padding(
              padding: EdgeInsets.only(bottom: 12),
              child: Row(
                children: [
                  Container(
                    width: 8,
                    height: 8,
                    decoration: BoxDecoration(
                      color: ThemeConfig.mainColor,
                      borderRadius: BorderRadius.all(Radius.circular(4)),
                    ),
                    margin: EdgeInsets.only(right: 10),
                  ),
                  Text(
                    titles[state.orderStatus - 1],
                    style: TextThemeConfig.Font13WithColor22,
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _orderResultWidget() {
    return ConfigResultWidget(state.items, dispatch);
  }

  Widget _orderPhotoWidget() {
    return Container(
      padding: EdgeInsets.only(left: 15, right: 15),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                '拍照留存',
                style: TextThemeConfig.Font16BoldWithColor22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
          ),
          Container(
            margin: EdgeInsets.only(bottom: 12),
            height: kOrderImageWidth,
            child: ListView.builder(
              itemBuilder: (BuildContext context, int index) {
                var file = state.orderPhoto[index];
                return Container(
                  margin: EdgeInsets.only(right: 12),
                  child: InkWell(
                    child: CustomImage(
                      file,
                      fit: BoxFit.fill,
                      width: kOrderImageWidth,
                      height: kOrderImageWidth,
                    ),
                    onTap: ()=> dispatch(SafeOrderViewActionCreator.onTapOrderPic(file)),
                  ),
                );
              },
              itemCount: state.orderPhoto.length,
              scrollDirection: Axis.horizontal,
              itemExtent: kOrderImageWidth + 12,
              padding: EdgeInsets.only(),
            ),
          )
        ],
      ),
    );
  }


  Widget _signPhotoWidget() {
    if (state.orderSignPhoto == null) return Container();
    return Container(
      margin: EdgeInsets.only(bottom: 30),
      padding: EdgeInsets.only(left: 15, right: 15),
      decoration: BoxDecoration(
          color: Colors.white,
          border: Border(
              bottom: BorderSide(color: ThemeConfig.separeColor, width: 10))),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            height: 44,
            child: Align(
              alignment: Alignment.centerLeft,
              child: Text(
                '电子签名',
                style: TextThemeConfig.Font16BoldWithColor22,
              ),
            ),
            margin: EdgeInsets.only(bottom: 4),
          ),
          Container(
            margin: EdgeInsets.only(bottom: 12,right: 12),
            height: 100,
            width: 175,
            child: InkWell(
              child: CustomImage(
                state.orderSignPhoto,
                width: 175,
                height: 100,
              ),
              onTap: ()=> dispatch(SafeOrderViewActionCreator.onTapSign()),
            ),
          ),
        ],
      ),
    );
  }

  return Scaffold(
    appBar: myAppBar(viewService.context, title: '安检详情'),
    body: state.isLoad == false
        ? MyLoadingWidget()
        : state.isEmpty
            ? _emptyWidget()
            : SingleChildScrollView(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      height: 43,
                      child: Center(
                        child: Text('最近一次安检时间：${state.lastTime}',style: TextThemeConfig.Font13WithColor99,),
                      ),
                    ),
                    _orderStatusWidget(),
                    _orderResultWidget(),
                    _orderPhotoWidget(),
                    _signPhotoWidget(),
                  ],
                ),
              ),
  );
}
